﻿body  { width: 1120px; margin: 0 auto; padding: 0; background: #b0c4de; font-family: Trebuchet MS; }
ul { list-style: none; margin: 0; padding: 0; }
img { border: 0; }

/* ----- FORMATTING ----- */
.align-center { text-align: center; }
.align-left { text-align: left; }
.float-left { float: left; }
.float-right { float: right; }

/* --- COMPETITION --- */
.competition  { /*position:absolute; top: 5px; left: 5px; right: 5px;*/ margin-top: 5px; 
    height: 100px; border: 1px solid #4682b4; background: #fff; color: #4682b4;
    border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

.competition .logo { float: left; height: 100px; margin-left: 5px; }
.competition .text { text-align: center;  }
.competition .title { margin-top: 25px; font-size: 24px; }
.competition .subtitle { font-size: 20px; }

.lang-box { display:inline;margin-left: 10px; }

/* --- DISCIPLINE LIST --- */
#discipline-list { /*position:absolute; top: 110px; bottom: 5px; left: 5px;*/ 
                   width: 300px; height: 620px; border: 1px solid #4682b4; background: #fff;
                    margin: 5px 0 0 5px; padding: 0; overflow: auto; list-style: none; }
#discipline-list a { display: block; font-size: 12px; color: #4682b4; text-decoration: none; padding: 6px 6px 5px 6px; }
#discipline-list a:hover { /*background: #ddd;*/ text-decoration: underline; }

.disc1 { margin: 2px; /*width: 270px;*/ border: 1px solid #4682b4; overflow: auto; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
.disc1 img { float: left; height: 40px; margin: 2px; }
.desc { font-size: 10px; }

/* ----- FUNCTIONS ----- */
#functions { margin: 5px 0 0 5px; padding: 20px 20px 20px 30px; overflow: auto; /*border: 1px solid red;*/ }

#functions a { float: left; width: 150px; border: 1px solid #4682b4; color: #4682b4; background: #fff; margin: 0 10px 0 0; 
               padding: 20px 10px; text-decoration: none; text-align: center;
               border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }

#functions a:hover { /*background: #ddd;*/ text-decoration: underline; }

/* ----- MAIN ----- */
#main { margin: 5px 0 0 5px; padding: 0; width: 794px;  }

#col1 { position: relative; float:left; width: 200px; border: 1px solid #4682b4; overflow: auto; background: #fff; color:#4682b4; margin: 0 0 5px 5px; }
#col1 li { margin: 2px; border: 1px solid #4682b4;
           border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
#col1 li a { padding: 6px 10px; display:block; text-decoration: none; color: #4682b4;  }
#col1 li a:hover { background: #ddd; }

#col2 { position: relative; float: left; margin-bottom: 5px; }
#col2 p { margin: 0 10px; color: #4682b4; }
.refresh-info { font-size: 80%; float: right; }


.header-info { margin: 2px; margin-bottom: 5px; border: 1px solid #4682b4; width: 790px; overflow: auto; background: #fff; 
               font-size: 20px; color: #4682b4; overflow: auto; 
               border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

.header-info p { margin: 0; padding: 20px; }

.main-info { margin: 2px 7px; border: 1px solid #4682b4; width: 780px; overflow: auto; background: #fff;
                   border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
                   transform: skew(-10deg); -ms-transform: skew(-10deg); -webkit-transform: skew(-10deg); }

.main-info-small { margin: 2px 7px; border: 1px solid #4682b4; width: 570px; overflow: auto; background: #fff;
                   border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
                   transform: skew(-10deg); -ms-transform: skew(-10deg); -webkit-transform: skew(-10deg); }

/* --- FOOTER --- */
.footer-info { margin: 2px; border: 1px solid #4682b4; width: 790px; display: block; overflow: auto; background: #fff; 
               font-size: 16px; color: #4682b4;
               border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

.footer-info p { margin: 0; padding: 10px 20px; }

#logo-box { float: left; margin: 1px 2px 2px 20px; padding: 0; }

#paging-box { float: right; margin: 3px 20px 2px 2px; overflow: auto; }
#paging-box a { float: right; border: 1px solid #4682b4; background: #fff; margin: 0 0 0 10px; padding: 5px 20px; text-decoration: none; color: #4682b4; font-size: 16px;
                   border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
#paging-box a:hover { background: #ddd; }

/* ----- BOXES ----- */
.order-box { float: left; margin: 4px 8px; padding: 2px 0; border: 2px solid #ccc; background: yellow; width: 40px; text-align: center; font-size: 18px; color: #4682b4;
                     border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }

.order-box-small { float: left; margin: 4px; padding: 2px 0; border: 2px solid #ccc; background: yellow; width: 30px; text-align: center; font-size: 16px; color: #4682b4;
                     border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
                     
.picture-box { float:left; margin: 7px 6px 2px 6px; padding: 0;
               transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg); }

.picture-box-small { float:left; margin: 8px 6px 2px 6px; padding: 0;
               transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg); }               

.lane-box { float:left; margin: 8px 2px 0 2px; padding: 0; width: 40px; text-align: center; font-size: 16px; color: #4682b4;
            transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg); }

.lane-box-small { float:left; margin: 10px 2px 2px 2px; padding: 0; width: 40px; text-align: center; font-size: 14px; color: #4682b4;
            transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg); }
                     
.competitor-box { float: left; margin: 2px; margin-top: 4px; color: #4682b4; width: 310px;
                  transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg);  }

.name-box { padding: 0; margin: 0; font-size: 14px;   border: 0; }
.competitor-info-box { padding: 0; margin: 0; font-size: 10px; border: 0; }

.name-box-small { float: left; margin: 7px; padding: 0; font-size: 18px; color: #4682b4; width: 320px; 
            transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg); }

.prefix-box { float: left; margin: 4px 0 4px 8px; padding: 7px 0 6px 0; background: #ccc; width: 30px; height: 17px; text-align: center; font-size: 13px; color: #fff;
                     border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; }

.sb-box { float: left; margin: 4px 8px 4px 0; padding: 2px 0; border: 2px solid #ccc; background: yellow; width: 100px; height: 22px; text-align: center; font-size: 18px; color: #4682b4;
                     border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; }

.result-box { float: left; margin: 4px 8px 4px 0; padding: 2px 0; border: 2px solid #ccc; background: yellow; width: 100px; text-align: center; font-size: 18px; color: #4682b4;
                     border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }

.result-box-small { float: left; margin: 4px 4px 4px 0; padding: 2px 0; border: 2px solid #ccc; background: yellow; width: 100px; text-align: center; font-size: 16px; color: #4682b4;
                     border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; }

.result-quality-box { float: left; margin: 4px 8px 4px 0; padding: 4px 6px; border: 2px solid #ccc; background: yellow; text-align: center; font-size: 12px; color: #4682b4;
                      transform: skew(10deg); -ms-transform: skew(10deg); -webkit-transform: skew(10deg);
                      border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; }